<!doctype html>
<html class="no-js" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>
    <!-- 启用360浏览器的极速模式(webkit) -->
    <meta name="renderer" content="webkit">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
    <meta name="HandheldFriendly" content="true">
    <!-- 微软的老式浏览器 -->
    <meta name="MobileOptimized" content="320">
    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrait">
    <!-- UC强制全屏 -->
    <meta name="full-screen" content="yes">
    <!-- QQ强制全屏 -->
    <meta name="x5-fullscreen" content="true">
    <!-- UC应用模式 -->
    <meta name="browsermode" content="application">
    <!-- QQ应用模式 -->
    <meta name="x5-page-mode" content="app">
    <!--这meta的作用就是删除默认的苹果工具栏和菜单栏-->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <!--网站开启对web app程序的支持-->
    <meta name="apple-touch-fullscreen" content="yes">
    <!--在web app应用下状态条（屏幕顶部条）的颜色-->
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <!-- windows phone 点击无高光 -->
    <meta name="msapplication-tap-highlight" content="no">
    <!--移动web页面是否自动探测电话号码-->
    <meta http-equiv="x-rim-auto-match" content="none">
    <!--移动端版本兼容 start -->
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"
          name="viewport"/>
    <!--移动端版本兼容 end -->
    <title>支付宝扫码支付</title>

    <!-- Set render engine for 360 browser -->
    <meta name="renderer" content="webkit">
    <!-- No Baidu Siteapp-->
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="icon" type="image/png" th:href="@{/img/favicon.png}">

    <!-- Add to homescreen for Chrome on Android -->
    <meta name="mobile-web-app-capable" content="yes">
    <link rel="icon" sizes="192x192" th:href="@{/img/app-icon72x72@2x.png}">

    <!-- Add to homescreen for Safari on iOS -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <link rel="apple-touch-icon-precomposed" th:href="@{/img/app-icon72x72@2x.png}">

    <!-- Tile icon for Win8 (144x144 + tile color) -->
    <meta name="msapplication-TileImage" th:content="@{/img/app-icon72x72@2x.png}">
    <meta name="msapplication-TileColor" content="#0e90d2">

    <link rel="stylesheet" th:href="@{/css/amazeui.min.css}">
    <link rel="stylesheet" th:href="@{/css/wx.css}">
    <meta name="__hash__" content="a7f55f8c2998c0e892ee07994c6c48a6_9564af55d8ce035f4603db35383c232e"/>
</head>
<script th:src="@{/js/qrcode.min.js}"></script>
<script th:src="@{/js/jquery.min.js}"></script>
<body>
<style>
    .qrcodeImg img {
        display: inline !important;
    }
</style>
<header class="alipay">
    <h1><a href="#" class="am-text-ir am-center">支付宝支付</a></h1>
</header>
<div class="am-g am-g-fixed am-margin-vertical wx-box">
    <div class="am-u-md-8 am-u-sm-12 am-u-sm-centered am-margin-vertical am-text-center">
        <div>
            <label>测试商户:</label>
            <select id="business">
                <option value="14">测试商户1</option>
            </select>
        </div>
        <div><label>请输入金额:</label><input id="bill" type="number" min="0.00" max="50000.00" placeholder="0.00"></div>
        <div>
            <label>请选择通道:</label>
            <select  id="type"  name="type" th:with="type=${@dict.getType('sys_channel_type')}">
                <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field=="${payType}"></option>
            </select>
        </div>
        <div>
            <button onclick="generateOrder()">生成订单</button>
        </div>
    </div>
</div>

<script th:inline="javascript">
    // var mid = '14'; // 商家id
    // 生成订单
    var account = [[${account}]]
    var payType = [[${payType}]]
    function generateOrder() {
        var now = new Date();
        var bill = document.getElementById('bill').value || 0;
        var jytd = document.getElementById('type').value
        var mid = document.getElementById('business').value
        var orderId = now.getFullYear() + "" + now.getMonth() + now.getDate() + now.getHours() + now.getMinutes() + now.getSeconds() + now.getMilliseconds() + mid;

        // var data = {childOrderno: orderId, shbh: mid, amount: bill, submitTime: Date.now(), jytd: jytd}
        // var win =  window.open(`addChannelOrder?childOrderno=${orderId}&businessId=${mid}&amount=${bill}&submitTime=${Date.now()}&payType=${jytd}`,"__self");
        if(jytd == '04' && bill < 15){
            alert('支付宝转卡模式,最低15元');
            return;
        }else if(jytd == '05' && bill < 1){
            alert('支付宝企业号,最低1元');
            return;
        }
        var data ={
            childOrderno:orderId,
            businessId: mid,
            amount:bill,
            submitTime: Date.now(),
            payType: jytd
        }
        if(!!account){
            data.account = account
        }
        $.ajax({
            type: "POST",
            url: "order",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify(data),
            dataType: "json",
            success: function (message) {
                if(message.code== 500){
                    alert(message.msg)
                }else{
                    window.open(message.data.payUrl,"_self");
                }
            },
            error: function (message) {
                alert(message.msg)
            }
        });
    }
</script>
</body>
</html>